$(document).ready(function() {
    var dataSourceAreas = new kendo.data.DataSource({
        transport: {
            create: {
                url: appBoschAreas.crudAreas.create,
                dataType: "json",
                statusCode: {
                    404: function() {
                        alert('El área ya fue asignada');
                    }
                }
            },
            read: {
                url: appBoschAreas.crudAreas.read,
                dataType: "json"
            },
            update: {
                url: appBoschAreas.crudAreas.update,
                dataType: "json"
            },
            destroy: {
                url: appBoschAreas.crudAreas.destroy,
                dataType: "json"
            },
            parameterMap: function(options, operation) {
                var params = {};
                switch (operation)
                {
                    case 'create':
                        params = {models: kendo.stringify(options.models)};
                    case 'read':
                        break;
                    case 'update':
                        params = {models: kendo.stringify(options.models)};
                        break;
                    case 'destroy':
                        params = {id: options.models[0].id};
                }
                return params;
            }
        },
        batch: true,
        schema: {
            model: {
                id: "id",
                fields: {
                    user_id: {
                        defaultValue: appBoschAreas.userId,
                        editable: true,
                        nullable: false
                    },
                    area_id: {
                        editable: true,
                        nullable: false,
                        defaultValue: appBoschAreas.areas[0].value
                    }
                }
            }
        }
    });

    $("#gridAreas").kendoGrid({
        resizable: true,
        columnMenu: true,
        scrollable: true,
        filterable: true,
        selectable: true,
        dataSource: dataSourceAreas,
        height: 250,
        toolbar: kendo.template($("#templateToolbarAreas").html()),
        columns: [
            {
                field: "area_id",
                title: "Área",
                values: appBoschAreas.areas
            },
            {command: [
                    {
                        name: "edit",
                        text: {
                            update: "Actualizar",
                            cancel: "Cancelar"
                        }
                    },
                    {
                        name: "destroy",
                        text: "Eliminar"
                    }], title: "&nbsp;"}],
        editable: {
            confirmation: "¿Estas seguro que deseas eliminar al usuario de está área?",
            mode: "popup"
        }
    });
}
);

